<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>EasyReader</title>
		<!--标准mui.css-->
		<link rel="stylesheet" type="text/css" href="css/mui.min.css" />
		<link rel="stylesheet" type="text/css" href="css/index.css" />
		<link rel="stylesheet" type="text/css" href="css/icons-extra.css"/>
		<!--标准js-->
		<script src="js/jquery-3.1.1.min.js"></script>
		<script src="js/mui.min.js"></script>
	</head>

	<body style="background-color: black;">
		<!-- 侧滑导航根容器 -->
		<div id="offCanvasWrapper" class="mui-off-canvas-wrap mui-draggable">
			<!-- 主页面容器 -->
			<div class="mui-inner-wrap">
				<!-- 菜单容器 -->
				<aside id="offCanvasSide" class="mui-off-canvas-left" style="background-color: #111;">
					<div id="offCanvasSideScroll" class="mui-scroll-wrapper">
						<div class="mui-scroll">
							<div class="updateWebmark" style="color: darkgray;">
								<div class="title">站点配置列表</div>
							</div>
							<ul id="weblist" class="mui-table-view mui-table-view-chevron mui-table-view-inverted">
								<li class="mui-table-view-cell">
									<a class="mui-navigate">
										<h4>站点配置缺失</h4>
										<h6>可点击“站点配置列表”更新</h6>
									</a>
								</li>
							</ul>
						</div>
					</div>
					<div id="version">
						Ver：版本号
					</div>
				</aside>
				<!-- 主页面标题 -->
				<header class="mui-bar mui-bar-nav" style="background-color: #111;">
					<a id="menu" class="mui-action-menu mui-icon mui-icon-gear  mui-pull-left" style="color: darkgray;"></a>
					<a id="title" class="mui-title" style="color: darkgray;">EasyReader</a>
					<a id="scaner" class="mui-icon mui-icon-extra mui-icon-extra-sweep mui-pull-right" style="color: darkgray;"></a>
				</header>
				<!-- 主页面内容容器 -->
				<div id="offCanvasContentScroll" class="mui-content mui-scroll-wrapper" style="background-color: #333;">
					<div class="mui-scroll">
						<!-- 主界面具体展示内容 -->
						<div id="booklist" class="mui-table-view">
							<li class="mui-table-view-cell">
								<div class="mui-slider-right mui-disabled">
									<a class="mui-btn mui-btn-red">删除</a>
								</div>
								<div class="mui-slider-handle">
									<div class="T1 Horizontal">
										<div class="M1 Horizontal">
											<h6>书名:</h6>
											<h6>书签:</h6>
											<h6>最新:</h6>
										</div>
										<div class="M2 Horizontal">
											<h4 class="书名">测试内容</h4>
											<h6 class="书签">第一章 初始测试章节</h6>
											<h6 class="最新">第九万九千九百九十九章 测试书签长度使用</h6>
										</div>
									</div>
									<div class="T2 Horizontal">
										<div class="M1 Horizontal">
											<h6>来源:</h6>
											<h6>作者:</h6>
											<h6>分类:</h6>
										</div>
										<div class="M2 Horizontal">
											<h6 class="来源">简单阅读</h6>
											<h6 class="作者">Antecer</h6>
											<h6 class="分类">看书神器</h6>
										</div>
									</div>
								</div>
							</li>
							<li class="mui-table-view-cell">
								<div class="mui-slider-right mui-disabled">
									<a class="mui-btn mui-btn-red">删除</a>
								</div>
								<div class="mui-slider-handle">
									<div class="T1 Horizontal">
										<div class="M1 Horizontal">
											<h6>书名:</h6>
											<h6>书签:</h6>
											<h6>最新:</h6>
										</div>
										<div class="M2 Horizontal">
											<h4 class="书名">测试内容</h4>
											<h6 class="书签">第一章 初始测试章节</h6>
											<h6 class="最新">第九万九千九百九十九章 测试书签长度使用</h6>
										</div>
									</div>
									<div class="T2 Horizontal">
										<div class="M1 Horizontal">
											<h6>来源:</h6>
											<h6>作者:</h6>
											<h6>分类:</h6>
										</div>
										<div class="M2 Horizontal">
											<h6 class="来源">简单阅读</h6>
											<h6 class="作者">Antecer</h6>
											<h6 class="分类">看书神器</h6>
										</div>
									</div>
								</div>
							</li>
						</div>
					</div>
				</div>
				<!-- off-canvas backdrop -->
				<div class="mui-off-canvas-backdrop">
					<a href="#" id="addmark"></a>
				</div>
			</div>
		</div>
		<script src="js/io-helper.js"></script>
		<script src="js/index.js"></script>
		<script src="js/checklist.js"></script>
	</body>
	<script type="text/javascript">
		mui.plusReady(function() { //Android沉浸式状态栏设置
			if (plus.navigator.isImmersedStatusbar()) { //判断设备是否支持
				var ImmerseHeight = Math.round(plus.navigator.getStatusbarHeight());
				document.body.setAttribute("class", "mui-fullscreen");
				document.body.style.top = ImmerseHeight + "px";
				document.body.style.height = document.body.offsetHeight + 'px';
			}
			document.querySelector("#version").innerHTML = "Ver：" + plus.runtime.version;
		});
	</script>

</html>